/*
 * @Descripttion: GGB
 * @version: 1.0
 * @Author: GGB
 * @Date: 2021-08-24 18:44:27
 * @LastEditors: GGB
 * @LastEditTime: 2021-08-24 18:59:01
 */
import 'package:flutter/material.dart';

class BottomOpen extends StatelessWidget {
  const BottomOpen({Key key}) : super(key: key);

  @override
  Widget build(BuildContext context) => Column(
        children: [
          Expanded(
              flex: 12,
              child: SingleChildScrollView(
                child: Padding(
                  padding: const EdgeInsets.only(top: 16, left: 8, right: 8),
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      Row(
                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                        children: [
                          Text(
                            "[Flutter] Dreamwalker Flutter Live Vibe",
                            style: TextStyle(
                                fontSize: 16, fontWeight: FontWeight.bold),
                          ),
                          IconButton(
                              icon: Icon(Icons.more_horiz), onPressed: () {})
                        ],
                      ),
                      GridView.count(
                          shrinkWrap: true,
                          crossAxisCount: 3,
                          mainAxisSpacing: 16,
                          crossAxisSpacing: 16,
                          children: List.generate(
                            10,
                            (index) => Container(
                                child: Column(
                              children: [
                                Expanded(
                                    flex: 8,
                                    child: Stack(
                                      children: [
                                        Positioned(
                                          child: Container(
                                            decoration: BoxDecoration(
                                                color: Colors.blue,
                                                image: DecorationImage(
                                                    image: NetworkImage(
                                                        "https://thispersondoesnotexist.com/image"),
                                                    fit: BoxFit.cover),
                                                borderRadius:
                                                    BorderRadius.circular(28)),
                                          ),
                                          left: 12,
                                          top: 4,
                                          right: 12,
                                          bottom: 4,
                                        ),
                                        Positioned(
                                          bottom: 0,
                                          left: 12,
                                          child: CircleAvatar(
                                            radius: 14,
                                            backgroundColor: Colors.white,
                                            child: Text(
                                              "🎉",
                                              style: TextStyle(fontSize: 12),
                                            ),
                                          ),
                                        ),
                                        Positioned(
                                          bottom: 0,
                                          right: 12,
                                          child: CircleAvatar(
                                            radius: 14,
                                            backgroundColor: Colors.white,
                                            foregroundColor: Colors.black,
                                            child: Icon(
                                              Icons.mic_off,
                                              size: 16,
                                            ),
                                          ),
                                        )
                                      ],
                                    )),
                                Expanded(
                                    flex: 2,
                                    child: Text(
                                      "Dreamwalker",
                                      style: TextStyle(
                                          fontWeight: FontWeight.bold),
                                    )),
                              ],
                            )),
                          )),
                      Padding(
                        padding: const EdgeInsets.symmetric(vertical: 16),
                        child: Text(
                          "Followed byt the speakers",
                          style: TextStyle(color: Colors.grey[300]),
                        ),
                      ),
                      GridView.count(
                          shrinkWrap: true,
                          crossAxisCount: 4,
                          mainAxisSpacing: 12,
                          crossAxisSpacing: 12,
                          children: List.generate(
                            16,
                            (index) => Container(
                                child: Column(
                              children: [
                                Expanded(
                                    flex: 8,
                                    child: Stack(
                                      children: [
                                        Positioned(
                                          child: Container(
                                            decoration: BoxDecoration(
                                                color: Colors.blue,
                                                image: DecorationImage(
                                                    image: NetworkImage(
                                                        "https://thispersondoesnotexist.com/image"),
                                                    fit: BoxFit.cover),
                                                borderRadius:
                                                    BorderRadius.circular(28)),
                                          ),
                                          left: 12,
                                          top: 4,
                                          right: 12,
                                          bottom: 4,
                                        ),
                                        Positioned(
                                          bottom: 0,
                                          left: 12,
                                          child: CircleAvatar(
                                            radius: 12,
                                            backgroundColor: Colors.white,
                                            child: Text(
                                              "🎉",
                                              style: TextStyle(fontSize: 12),
                                            ),
                                          ),
                                        ),
                                      ],
                                    )),
                                Expanded(
                                    flex: 2,
                                    child: Text(
                                      "Dreamwalker",
                                      style: TextStyle(
                                          fontWeight: FontWeight.bold,
                                          fontSize: 12),
                                    )),
                              ],
                            )),
                          )),
                      Padding(
                        padding: const EdgeInsets.symmetric(vertical: 16),
                        child: Text(
                          "Others in the room",
                          style: TextStyle(color: Colors.grey[300]),
                        ),
                      ),
                      GridView.count(
                          shrinkWrap: true,
                          crossAxisCount: 4,
                          mainAxisSpacing: 12,
                          crossAxisSpacing: 12,
                          children: List.generate(
                            36,
                            (index) => Container(
                                child: Column(
                              children: [
                                Expanded(
                                    flex: 8,
                                    child: Stack(
                                      children: [
                                        Positioned(
                                          child: Container(
                                            decoration: BoxDecoration(
                                                color: Colors.blue,
                                                image: DecorationImage(
                                                    image: NetworkImage(
                                                        "https://thispersondoesnotexist.com/image"),
                                                    fit: BoxFit.cover),
                                                borderRadius:
                                                    BorderRadius.circular(28)),
                                          ),
                                          left: 12,
                                          top: 4,
                                          right: 12,
                                          bottom: 4,
                                        ),
                                        Positioned(
                                          bottom: 0,
                                          left: 12,
                                          child: CircleAvatar(
                                            radius: 12,
                                            backgroundColor: Colors.white,
                                            child: Text(
                                              "🎉",
                                              style: TextStyle(fontSize: 12),
                                            ),
                                          ),
                                        ),
                                      ],
                                    )),
                                Expanded(
                                    flex: 2,
                                    child: Text(
                                      "Dreamwalker",
                                      style: TextStyle(
                                          fontWeight: FontWeight.bold,
                                          fontSize: 12),
                                    )),
                              ],
                            )),
                          )),
                    ],
                  ),
                ),
              )),
          Expanded(
              flex: 1,
              child: Row(
                children: [
                  Container(
                    width: 140,
                    margin: EdgeInsets.symmetric(vertical: 12),
                    decoration: BoxDecoration(
                        color: Colors.grey[200],
                        borderRadius: BorderRadius.circular(24)),
                    child: Center(
                      child: Row(
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: [
                          Text(
                            "✌🏼 Leave quietly",
                            style: TextStyle(color: Colors.red),
                          ),
                        ],
                      ),
                    ),
                  ),
                  Spacer(),
                  CircleAvatar(
                    backgroundColor: Colors.grey[200],
                    foregroundColor: Colors.black87,
                    child: Icon(Icons.add),
                  ),
                  SizedBox(
                    width: 12,
                  ),
                  CircleAvatar(
                    backgroundColor: Colors.grey[200],
                    child: Text("✋🏼"),
                  ),
                ],
              )),
        ],
      );
}
